﻿// full size directive to fit an element to the screen
angular.module('app.common').directive('fullSize', ['$window', function ($window) {
	return {
		restrict: 'A',
		link: {
			post: function postLink(scope, element, attrs) {
				var w = angular.element($window);
				scope.style = { 'height': 'auto', 'width': 'auto' };
				// gets the window size
				scope.getWindowDimensions = function () {
					return { 'h': w.height(), 'w': w.width() };
				};
				// gets the height of the element
				scope.getHeight = function () {
					return element.height();
				};
				// gets the width of the element
				scope.getWidth = function () {
					return element.width();
				}
				// adjust height when element height changes
				scope.$watch(scope.getHeight, function (newValue, oldValue) {
					scope.itemHeight = newValue;
				});
				// Adjust width with the width of the element changes
				scope.$watch(scope.getWidth, function (newValue, oldValue) {
					scope.itemWidth = newValue;
				});
				// adjust width and height when the window size changes
				scope.$watch(scope.getWindowDimensions, function (newValue, oldValue) {					
					if (newValue.h < newValue.w) {
						scope.style.height = (newValue.h * .8).toString() + 'px';
						scope.style.width ='auto';
					}
					else {
						scope.style.width = (newValue.w * .8).toString() + 'px';
						scope.style.height = 'auto';
					}
				}, true);
				// bind the resize to adjust the size
				w.bind('resize', function () {
					scope.$apply();
				});
			}
		}
	}
}]);

//angular.module('app.common', []).directive('resize', function ($window) {
//	return function (scope, element) {
//		console.log('here');
//		var w = angular.element($window);

//		scope.getWindowDimensions = function () {
//			return { 'h': w.height(), 'w': w.width() };
//		};

//		scope.$watch(scope.getWindowDimensions, function (newValue, oldValue) {
//			scope.windowHeight = newValue.h;
//			scope.windowWidth = newValue.w;
//			console.log('er');
//			//scope.style = function () {
//			//	if (newValue.h > newValue.w) {
//			//		return {
//			//			'height': (newValue.h * .8).toString() + 'px',
//			//			'width': 'auto'
//			//		};
//			//	}
//			//	return {
//			//		'height': 'auto',
//			//		'width': (newValue.w * .8).toString() + 'px'
//			//	};
//			//};

//		}, true);

//		w.bind('resize', function () {
//			scope.$apply();
//		});
//	}
//})